<template>
  <view class="main-pd u-p-t-20">
    <view class="u-m-b-20 color-333 font-28">左滑进行操作</view>
    <view v-for="item in cyArr" :key="item.dzkcyId" class="u-m-b-20">
      <u-swipe-action>
        <u-swipe-action-item
          :options="options"
          @click="btnsClick($event, item)">
          <view class="u-card">
            <view class="list-item">
              <view class="u-flex u-flex-between u-flex-items-center">
                <view>与业主关系</view>
                <view>{{ item.cyyzgx || "" }}</view>
              </view>
            </view>
            <view class="list-item">
              <view class="u-flex u-flex-between">
                <view>成员姓名</view>
                <view>
                  {{ item.cyName || "" }}
                </view>
              </view>
            </view>
            <view class="list-item">
              <view class="u-flex u-flex-between">
                <view>性别</view>
                <view>
                  {{ item.cySex || "" }}
                </view>
              </view>
            </view>
            <view class="list-item">
              <view class="u-flex u-flex-between">
                <view>联系方式</view>
                <view>
                  {{ item.cyTel || "" }}
                </view>
              </view>
            </view>
          </view>
        </u-swipe-action-item>
      </u-swipe-action>
    </view>

    <view class="u-m-t-30">
      <u-button
        text="添加成员信息"
        color="linear-gradient(90deg, #FA827D 0%, #F34B47 100%)"
        :customStyle="{
          fontSize: '36rpx',
          height: '96rpx',
        }"
        @click="$u.route('/pagesB/dzyz/cyxx',{yzkId:yzkId})"></u-button>
    </view>
  </view>
</template>
<script setup>
import { ref, reactive } from "vue";
import { getcardCyApi, delcardCyApi } from "@/api/index";
import { onLoad, onShow } from "@dcloudio/uni-app";
import useInfoStore from "@/store/user";
import { showConfirm } from "@/utils/common";
const userStore = useInfoStore();
let cyArr = ref([]);
let yzkId = ref('')
let options = ref([
  {
    text: "编辑",
    style: {
      backgroundColor: "#55aaff",
      color: "#fff",
    }
  },
  {
    text: "删除",
    style: {
      backgroundColor: "#f34b47",
      color: "#fff",
    }
  },
]);
// 获取电子卡成员信息
const getcardCyHandle = () => {
  getcardCyApi({
    dzyzkId: yzkId.value,
  }).then((res) => {
    if (res.success) {
      let data = res.data;
      cyArr.value = data;
    }
  });
};
// 操作按钮点击
const btnsClick = (val, param) => {
  if (val.index == 0) {
    uni.$u.route("/pagesB/dzyz/cyxx", { id: param.dzyzkId });
  }
  if (val.index == 1) {
    showConfirm("确定删除该成员信息吗？").then((modelSuccess) => {
      if (modelSuccess.confirm) {
        delcardCyApi(param.dzkcyId).then((res) => {
          if (res.success) {
            uni.$u.toast("删除成功！");
            getcardCyHandle();
          } else {
            uni.$u.toast(res.msg);
          }
        });
      }
    });
  }
};
onShow(() => {
  getcardCyHandle();
});
onLoad((param)=>{
  console.log('param: ', param);
  yzkId.value = param.yzkId;
})
</script>
<style lang="scss"></style>
